<template>
  <div class="page_padding">
    <MyNavBar @goback="goback" :title="title" />
    <div class="audit_link">
      <van-list
        v-model="loading"
        :finished="finished"
        :finished-text="ExtraParmas.length ? '没有更多了' : ''"
        @load="getPCApplyList">
        <div class="list_con_main" v-if="ExtraParmas.length">
          <div v-for="(item, index) in ExtraParmas" :key="index">
            <div class="link_one">
              <div class="link_one_top">
                <div class="link_left_top">
                  <van-radio
                    v-model="item.check"
                    :name="index"
                    icon-size="15px"
                    @click="btnClicks(item, index)"></van-radio>
                  <span>{{ item.reimburseReason }}</span>
                </div>
              </div>
              <div class="link_one_bottom">
                <div>{{ item.formType }}</div>
                <div>{{ item.reimburseTime }}</div>
              </div>
            </div>
          </div>
        </div>
        <van-empty v-if="ExtraParmas.length == 0" description="暂无数据" />
      </van-list>
      <div class="fead_boot" v-if="ExtraParmas.length">
        <div class="btn_li" @click="submit()">确 定</div>
      </div>
    </div>
  </div>
</template>

<script>
import MyNavBar from '@com/MyNavBar'
import { getlistPassTripReimburse } from '@api/api-dailyManage.js'
export default {
  components: { MyNavBar },
  data() {
    return {
      title: '关联申请单',
      loading: false,
      finished: false,
      sticky: false,
      ExtraParmas: [],
      selectOne: {},
      tablePage: {
        currentPage: 1,
        pageSize: 10,
        totalResult: 0,
      },
    }
  },
  created() {},
  mounted() {},
  methods: {
    goback() {
      this.$router.go(-1)
    },
    btnClicks(item, index) {
      for (const i in this.ExtraParmas) {
        this.$set(this.ExtraParmas[i], 'check', '')
      }
      item.check = index
      this.selectOne = item
    },
    getPCApplyList() {
      // 获取已申报列表
      this.loading = true
      getlistPassTripReimburse({
        currentPage: this.tablePage.currentPage,
        pageSize: this.tablePage.pageSize,
        tenantId: localStorage.tenantId,
        userId: localStorage.userId,
      })
        .then(res => {
          if (res.code === 0) {
            this.ExtraParmas.push(...res.data.records)
            for (const i in this.ExtraParmas) {
              this.$set(this.ExtraParmas[i], 'check', '')
            }
            this.tablePage.totalResult = res.data.total
            this.tablePage.currentPage++
            this.loading = false
            if (this.ExtraParmas.length === this.tablePage.totalResult) {
              this.finished = true
            }
          }
        })
        .catch(err => {
          console.log(err)
          this.loading = false
          this.finished = true
        })
    },
    submit() {
      if (Object.keys(this.selectOne).length === 0) {
        this.$toast.fail('请选择需要关联的数据')
        return
      }
      sessionStorage.setItem('linkFormData', JSON.stringify(this.selectOne))
      this.$router.go(-1)
    },
  },
}
</script>

<style lang="scss" scoped>
.audit_link {
  font-size: 13px;
  .list_con_main {
    margin-bottom: 46px;
    .link_one {
      padding: 15px 7px;
      border-bottom: 1px solid #efefef;
      .link_one_top {
        display: flex;
        justify-content: space-between;
        align-items: center;
      }
      .link_one_bottom {
        margin-top: 7px;
        padding-left: 15px;
      }
      .link_left_top {
        display: flex;
        .van-radio {
          margin-right: 5px;
        }
        span {
          margin-left: 5px;
          flex: 1;
        }
      }
    }
  }
}
</style>
